<template>
  <div class="channelList">
    <AreaWarp :padding="true">
      <SearchWarp :label="'渠道名称'">
        <el-input v-model.trim="searchInfo.channelName" placeholder="渠道名称"></el-input>
      </SearchWarp>
      <SearchWarp :label="'添加时间'">
        <el-date-picker v-model="searchInfo.registerTime" :picker-options="pickerOptions" type="daterange" range-separator="-" start-placeholder="开始日期"
                        end-placeholder="结束日期" :editable="false"></el-date-picker>
      </SearchWarp>
      <SearchWarp :label="'修改时间'">
        <el-date-picker v-model="searchInfo.modifyTime" :picker-options="pickerOptions" type="daterange" range-separator="-" start-placeholder="开始日期"
                        end-placeholder="结束日期" :editable="false"></el-date-picker>
      </SearchWarp>
      <BtnWarp>
        <el-button type="primary" icon="el-icon-search" @click="search">搜索</el-button>
        <el-button type="info" icon="el-icon-delete" @click="reset">重置</el-button>
      </BtnWarp>
    </AreaWarp>

    <AreaTitleWarp :title="''">
      <el-button type="primary" icon="el-icon-circle-plus">添加渠道</el-button>
    </AreaTitleWarp>



    <AreaWarp :padding="false">
      <el-table :data="tableInfo.list" style="width: 100%" class="pub-table" header-row-class-name="pub-table-header-row" header-cell-class-name="pub-table-header-cell"
        tooltip-effect="dark"
      >
        <el-table-column prop="num" label="渠道名称" min-width="120"></el-table-column>
        <el-table-column prop="remindTime" label="账号" min-width="180" :formatter="formatter_timeYMDHMS"></el-table-column>
        <el-table-column prop="collectionUserRealname" label="添加时间" min-width="120"></el-table-column>
        <el-table-column prop="relationName" label="修改时间" min-width="120"></el-table-column>
        <el-table-column  label="修改" min-width="120">
            <template slot-scope="scope">
              <el-button type="text" size="small" @click="followUp(scope.row)">修改</el-button>
            </template>
        </el-table-column>
        <el-table-column  label="重置密码" min-width="120">
            <template slot-scope="scope">
              <el-button type="text" size="small" @click="followUp(scope.row)">重置密码</el-button>
            </template>
        </el-table-column>
      </el-table>
      <el-pagination
        layout="total,sizes,prev, pager, next, jumper" class="pub-page"
        :current-page="searchInfo.page"
        :page-sizes="[20,50,100]"
        :page-size="searchInfo.size"
        :total="tableInfo.total"
        @current-change="search"
        @size-change="handleSizeChange"
      >
      </el-pagination>
    </AreaWarp>
  </div>
</template>
<script>
export default {
  data() {
    return {
      searchInfo: {
        channelName: "",
        registerTime: "",
        modifyTime: "",
        size: 20,
        page: 1
      },
      tableInfo:{
        list:[],
        total:0
      }
    };
  },
  methods: {
    handleSizeChange(val) {
      let that = this;
      that.searchInfo.size = val;
      that.searchInfo.page = 1;
      that.search();
    },
    search() {},
    reset() {}
  }
};
</script>
<style lang="less">
.channelList {
}
</style>
